import { VueComponent } from 'vue-typescript'
import { AboutComponent } from '../../views/about/about';
import {dataService} from '../../service/dataService';

var VueTables = require('vue-tables');
Vue.use(VueTables.client,{
    filterable:false,
    compileTemplates:true
});

@VueComponent({
    template: require('./home.html'),
    style: require('./home.scss')
})
export class HomeComponent extends Vue {
    el:'#people'
    components:({
        AboutComponent:AboutComponent,
        vclienttable:any,
    })
    rules= {
                required: true,
                minlength: 3,
                maxlength: 16
            }
    columns=['id','name','age','operation']
    tableData= [
            {id:1, name:"John",age:"20"},
            {id:2, name:"Jane",age:"24"},
            {id:3, name:"Susan",age:"16"},
            {id:4, name:"Chris",age:"55"},
            {id:5, name:"Dan",age:"40"},
            {id:6, name:"John",age:"20"},
            {id:7, name:"Jane",age:"24"},
            {id:8, name:"Susan",age:"16"},
            {id:9, name:"Chris",age:"55"},
            {id:10, name:"Dan",age:"40"},
            {id:11, name:"Dan",age:"40"},
            {id:12, name:"Dan",age:"40"}
            ]
    options= {
    // see the options API
    headings:{
        id:"回家",
        name:"哈哈哈",
        age:"呵呵",
        operation:'操作'
    },
    templates: {
        operation: function(row) {
          return `<a href='#!/${row.id}/edit'><i class='glyphicon glyphicon-edit'></i></a>
          <a class='glyphicon glyphicon-trash' title='删除' href='javascript:void(0);' @click='$parent.deleteMe(${row.id})'></a>`
        }
      },
    };
    deleteMe=function(id){
      
       bootbox.alert("This is the default alert!");
        //调后台接口(删除)
        console.info('test');
        
    };
    getInquiryList=function(){
        //area
        // dataService().Area.getProvince();
        // dataService().Area.getCity("0101");
        // dataService().Area.getCountry("0101")

        // //CspInquiry
        // dataService().CspInquiry.getCspInquiryList("","","","","","","",0,10)
        // dataService().CspInquiry.getCspInquiry("524845")
        // dataService().CspInquiry.addCspInquiry({a:10,b:20});


        // dataService().Inquiry.editInquiry("454",{aa:10,k:20})

        dataService().User.updatePassword("54145", "4545", "4545")
        // dataService().CspInquiry.getCspInquiryList("","","","","","","",0,10);
        // dataService().CspInquiry.getCspInquiry("12");
        // dataService().Area.getProvince();
        
        // dataService().Area.getCountry("0101");
        // dataService().CspOrder.getCspOrderList("","","","","","",0,10);
        // dataService().CustomerRepresentative.getCustomerList("",0,10);
        // dataService().Goods.getDoodsList("","",0,10);
        // dataService().GoodsType.getDoodsTypeList("",0,10);
        // dataService().Inquiry.getInquiryList("","","","","","","",0,10);
        // dataService().LinePrice.getLinePriceList("","","",0,10);
        // dataService().Order.getOrderList("","","","","","",0,10);
        // dataService().Project.getProjectList("",0,10);
        // dataService().Settle.getSettleList("",0,10)




    }
    package:string = 'vue-typescript';
    repo:string = 'https://github.com/itsFrank/vue-typescript';
    // result1:string= null;
    // formatDatetime = function(datetime) {
    // if (datetime === null) {
    //     return "[null]";
    // } else {
    //     return datetime.format("YYYY-MM-DD HH:mm:ss");
    // }
    // }

}
